<template>
<div>
    <el-dropdown class="userDd">
        <div class="userDrop">
            <span class="userDrop_text">admin<i class="el-icon-caret-bottom"></i></span>
            <img src="@/assets/avatar.jpeg" alt="user" />
        </div>
        <el-dropdown-menu solt="dropdown">
            <el-dropdown-item>
                <router-link to="/"><i class="el-icon-s-home"></i>首页</router-link>
            </el-dropdown-item>
            <el-dropdown-item>
                <router-link to="/"><i class="el-icon-s-custom"></i>我的主页</router-link>
            </el-dropdown-item>
            <el-dropdown-item divided>
                <a href="javascript:void(0)" @click="loginOut"><i class="el-icon-switch-button"></i>登出</a>
            </el-dropdown-item>
        </el-dropdown-menu>
    </el-dropdown>
</div>
</template>

<script>
import {
    mapMutations
} from 'vuex'
export default {
    methods: {
        ...mapMutations(['DEL_TOKEN', 'DEL_USERNAME']),

        loginOut() {
            this.DEL_TOKEN()
            this.DEL_USERNAME()

            this.$router.options.routes[1].children.splice(1)
            this.$router.$addRoutes(this.$router.options.routes)
            
            this.$router.replace('/login')
        }
    }
}
</script>